<template>
	<view class="content">
		<view class="box">
			<view class="img">
				<image :src="detailList.app_list_pic_url" mode="widthFix"></image>
				<h2 class="h2">{{detailList.name}}</h2>
			</view>
			<view class="txt">
				{{detailList.simple_desc}}
			</view>

		</view>

	</view>
</template>

<script>
	import {
		ApiBrandDetail
	} from "@/utils/api.js"
	export default {
		data() {
			return {
				id: null,
				detailList: []
			}
		},
		async onLoad(e) {
			this.id = e.id
			let res = await ApiBrandDetail(this.id)
			console.log(res);
			this.detailList = res.data.brand
		},
		methods: {

		}
	}
</script>

<style lang="scss">
	.content {
		height: 100vh;
		background-color: #efefef;

		.box {
			background-color: #fff;

			.img {
				width: 100%;
				height: 420rpx;
				position: relative;

				image {
					width: 100%;
					height: 100%;
				}

				.h2 {
					font-size: 40rpx;
					color: #fff;
					text-decoration: underline;
					font-weight: normal;
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
					left: 50%;
					transform: translateX(-50%);
				}
			}

			.txt {
				background-color: #fff;
				font-size: 36rpx;
				text-align: center;
				color: #666;
				line-height: 52rpx;
				padding: 40rpx 20rpx;
			}
		}
	}
</style>
